<!DOCTYPE html>
<html>
<head>
<title>创建页面</title>
<meta charset="UTF-8">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="http://apps.bdimg.com/libs/jquery/1.6.4/jquery.js"></script>
<script src="http://apps.bdimg.com/libs/jquery/1.6.4/jquery.min.js"></script>
</head>
<body>
<div>
<form>
    <li>
	    <label>页面类型</label>
		<select name='type'>
		<option value='1'>列表页</option>
		<option value='2'>编辑页</option>
		</select>
	</li>
<ul id='list'>
	
	
	<a id='addnew'  href='javascript:void(0)'>增加项目</a>
	<a id='addop'  href='javascript:void(0)'>增加操作</a>
	<ul id='firstul'>
	<li>
	    <label>标题页面</label>
		<input name='listtitle[]' type="text" value=''>
	</li>
	<li>
	    <label>数据配置</label>
		<input name='listdata[]' type="text" value=''>
	</li>
	<li>
	   <a onclick='del()' href='javascript:void(0)'>删除</a>
	</li>
	</ul>
</ul>

<ul id='edit'>
  <a id='addedit'  href='javascript:void(0)'>增加项目</a>
	<ul id='firstedit'>
	<li>
	    <label>标题页面</label>
		<input name='title[]' type="text" value=''>
	</li>
	<li>
	    <label>类型</label>
		<select name='type[]'>
		<option value='1'>列表页</option>
		<option value='2'>编辑页</option>
		</select>
	</li>
	
	<li>
	    <label>名称</label>
		<input name='name[]' type="text" value=''>
	</li>
	
	<li>
	    <label>赋值</label>
		<input name='value[]' type="text" value=''>
	</li>
	</ul>
</ul>
</form>
	<script>
     $('#addnew').click(
	 function(){
		
		var html='<hr><ul>';
		html +=$('#firstul').html();
		html+='</ul>';
		
		$('#list').append(html); 
	 });
	


	$('#addedit').click(
	 function()
	 {
		var html='<hr><ul>';
		html+=$('#firstul').html();
		html+='</ul>';
		
		$('#edit').append(html);  
	 });
	 
	 function del()
	 {
		 
		 $(this).parent().parent().remove();
	 }
	
	 
	 
	 
	 
	 
	</script>
</div>
</body>
</html>
